1、页面代码布局
2、点击放大设置
var renderImg = function () { form.render(); layer.photos({ photos: '.theImg' , anim: 5 //0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数） }); } 3、上传成功之后，回显
//图片上传 upload.render({ elem: '#uploadImg' , url: "commonCtrl/receiptUpload" //必填项 , method: '' //可选项。HTTP类型，默认post , accept: 'images' , acceptMime: 'image/*' , data: {flag: "rotationChart"} //可选项。额外的参数，如：{id: 123, abc: 'xxx'} , before: function (obj) { //obj参数包含的信息，跟 choose回调完全一致，可参见上文。 //预读本地文件示例，不支持ie8 } ,done: function(res){ //如果上传失败 if(!res.success){ return layer.alert('上传失败'); } //上传成功 var img = '
'; $("#rotationChartDiv").html(img); $("#url").val(res.data.url); //点击放大 renderImg(); } ,error: function(){ layer.msg("上传失败"); } }); end：补上上传接口实现代码
controller层
@RequestMapping(value = "/receiptUpload", method = RequestMethod.POST) @ResponseBody public YJLResponseModel receiptUpload(@RequestParam("file") MultipartFile img, @RequestParam String flag) { return UploadUtil.fileUploadServices(img, flag); } service层：
public static Map fileUploadServices(MultipartFile file, String flag) { Map result = new HashMap<>(); String name = file.getOriginalFilename(); String suffixName = ""; /* * MultipartFile转File */ File f = null; try { if (!name.contains(".")) { errorMsg = "文件不能为空！"; throw new Exception(getErrorMsg()); } else { suffixName = name.substring(name.indexOf(".")); f = File.createTempFile("tmp", null); //通过MultipartFile的transferTo(File dest)这个方法来转存文件到指定的路径。MultipartFile转存后，无法再操作，会报错 file.transferTo(f); //在JVM进程退出的时候删除文件,通常用在临时文件的删除. f.deleteOnExit(); /* * File转byte */ byte[] buffer = null; if (f != null) { FileInputStream fis = new FileInputStream(f); ByteArrayOutputStream bos = new ByteArrayOutputStream(); byte[] b = new byte[1024]; int n; while ((n = fis.read(b)) != -1) { bos.write(b, 0, n); } fis.close(); bos.close(); buffer = bos.toByteArray(); /* * byte上传到webService */ UploadService myServiceImplService = new UploadService(); UploadServiceSoap msis = myServiceImplService.getUploadServiceSoap(); //是否上传成功 Holder hb = new Holder<>(); //上传成功后文件的路径 Holder hs = new Holder<>(); msis.uploadFile(buffer, flag, suffixName, hb, hs); if (hb.value) { setSuccess(true); Map map = new HashMap<>(); map.put("url", hs.value); result.put("data",map); } else { errorMsg = "上传失败！"; } } else { errorMsg = "文件不能为空！"; throw new Exception(getErrorMsg()); } } } catch (Exception e) { e.printStackTrace(); logger.error(e.getMessage()); } finally{ result.put("msg",errorMsg); } return result; }